import 'package:dotted_border/dotted_border.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:gourmet/color/hex.dart';
import 'package:gourmet/extensions/ex_widget.dart';
import 'package:gourmet/route/index.dart';
import 'package:gourmet/utils/colors.dart';
import 'package:gourmet/utils/radian.dart';
import 'package:gourmet/utils/styles.dart';

class StoreMineController extends GetxController {
  final double navHeight = 44 + Get.mediaQuery.padding.top;
  final double navTop = 44.0;

  RxBool ischecked = RxBool(false);
}

class StoreMinePage extends GetView<StoreMineController> {
  const StoreMinePage({super.key});

  @override
  Widget build(BuildContext context) {
    return MediaQuery.removeViewPadding(
      context: context,
      removeBottom: true,
      removeLeft: true,
      removeRight: true,
      removeTop: true,
      child: Scaffold(
        backgroundColor: Colors.white,
        appBar: PreferredSize(
          preferredSize: Size.fromHeight(controller.navHeight),
          child: AnnotatedRegion<SystemUiOverlayStyle>(
            value: SystemUiOverlayStyle.dark,
            child: Container(
              color: Colors.white,
              height: controller.navHeight,
              padding: Get.mediaQuery.padding,
              child: Stack(
                children: [
                  Positioned(
                    width: 40,
                    height: controller.navTop,
                    top: 0,
                    left: 0,
                    child: Center(
                      child: Icon(
                        CupertinoIcons.chevron_back,
                        size: 20,
                        color: HexColor(ColorsUtils.color0000),
                      ),
                    ).onTap(Get.back),
                  ),
                  Center(
                    child: Text(
                      '我要开店',
                      softWrap: true,
                      style: StylesUtils.customTextStyle(
                        fontSize: StylesUtils.fontSize16,
                        fontWeight: FontWeight.w700,
                        color: ColorsUtils.color0000,
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ),
        body: SingleChildScrollView(
          padding: EdgeInsets.symmetric(horizontal: (Get.width - 345) / 2),
          child: Column(
            children: [
              Container(
                margin: const EdgeInsets.only(top: 20),
                decoration: BoxDecoration(
                  color: HexColor(ColorsUtils.colorF5f5),
                  borderRadius: BorderRadius.circular(5),
                ),
                padding: const EdgeInsets.all(15),
                child: ListBody(
                  children: [
                    Align(
                      alignment: Alignment.centerLeft,
                      child: Text(
                        '商家开店流程',
                        style: StylesUtils.customTextStyle(
                          fontSize: StylesUtils.fontSize16,
                          color: ColorsUtils.color0000,
                        ),
                      ),
                    ),
                    Padding(
                      padding: const EdgeInsets.only(top: 25, bottom: 10),
                      child: Row(
                        children: [
                          Expanded(
                            child: Column(
                              children: [
                                Center(
                                  child: Icon(
                                    CupertinoIcons.ant_fill,
                                    size: 35,
                                    color: HexColor(ColorsUtils.color9999),
                                  ),
                                ),
                                Container(
                                  margin: const EdgeInsets.only(top: 10),
                                  alignment: Alignment.center,
                                  child: Text(
                                    '提交资料',
                                    style: StylesUtils.customTextStyle(
                                      fontSize: StylesUtils.fontSize15,
                                      color: ColorsUtils.color0000,
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                          Expanded(
                            child: Column(
                              children: [
                                Center(
                                  child: Icon(
                                    CupertinoIcons.gift_fill,
                                    size: 35,
                                    color: HexColor(ColorsUtils.color9999),
                                  ),
                                ),
                                Container(
                                  margin: const EdgeInsets.only(top: 10),
                                  alignment: Alignment.center,
                                  child: Text(
                                    '平台审核',
                                    style: StylesUtils.customTextStyle(
                                      fontSize: StylesUtils.fontSize15,
                                      color: ColorsUtils.color0000,
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                          Expanded(
                            child: Column(
                              children: [
                                Center(
                                  child: Icon(
                                    CupertinoIcons.hammer_fill,
                                    size: 35,
                                    color: HexColor(ColorsUtils.color9999),
                                  ),
                                ),
                                Container(
                                  margin: const EdgeInsets.only(top: 10),
                                  alignment: Alignment.center,
                                  child: Text(
                                    '开始营业',
                                    style: StylesUtils.customTextStyle(
                                      fontSize: StylesUtils.fontSize15,
                                      color: ColorsUtils.color0000,
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ],
                      ),
                    )
                  ],
                ),
              ),
              Container(
                alignment: Alignment.centerLeft,
                padding: const EdgeInsets.symmetric(vertical: 20),
                child: Text(
                  '您需要准备以下材料：',
                  style: StylesUtils.customTextStyle(
                    fontSize: StylesUtils.fontSize17,
                    color: ColorsUtils.color0000,
                  ),
                ),
              ),
              Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  SizedBox(
                    width: 135,
                    height: 90,
                    child: DottedBorder(
                      child: Center(
                        child: Icon(
                          CupertinoIcons.cloud_upload_fill,
                          size: 40,
                          color: HexColor(ColorsUtils.color9999),
                        ),
                      ),
                    ),
                  ),
                  Expanded(
                    child: Padding(
                      padding: const EdgeInsets.only(left: 15),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Container(
                            alignment: Alignment.centerLeft,
                            child: Text(
                              '1、实体店铺照片',
                              style: StylesUtils.customTextStyle(
                                fontSize: StylesUtils.fontSize15,
                                color: ColorsUtils.color0000,
                              ),
                            ),
                          ),
                          Container(
                            padding: const EdgeInsets.only(top: 15, right: 15),
                            alignment: Alignment.centerLeft,
                            child: Text(
                              '需要提供有完整牌匾的门面照片和真实内部环境照片',
                              style: StylesUtils.customTextStyle(
                                color: ColorsUtils.color7979,
                                lineHeight: 1.5,
                              ),
                            ),
                          )
                        ],
                      ),
                    ),
                  ),
                ],
              ),
              Padding(
                padding: const EdgeInsets.symmetric(vertical: 30),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    SizedBox(
                      width: 135,
                      height: 90,
                      child: DottedBorder(
                        child: Center(
                          child: Icon(
                            CupertinoIcons.cloud_upload_fill,
                            size: 40,
                            color: HexColor(ColorsUtils.color9999),
                          ),
                        ),
                      ),
                    ),
                    Expanded(
                      child: Padding(
                        padding: const EdgeInsets.only(left: 15),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Container(
                              alignment: Alignment.centerLeft,
                              child: Text(
                                '2、法人身份证',
                                style: StylesUtils.customTextStyle(
                                  fontSize: StylesUtils.fontSize15,
                                  color: ColorsUtils.color0000,
                                ),
                              ),
                            ),
                            Container(
                              padding:
                                  const EdgeInsets.only(top: 15, right: 15),
                              alignment: Alignment.centerLeft,
                              child: Text(
                                '需要提供营业执照法人的身份证正反面照片',
                                style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color7979,
                                  lineHeight: 1.5,
                                ),
                              ),
                            )
                          ],
                        ),
                      ),
                    ),
                  ],
                ),
              ),
              Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  SizedBox(
                    width: 135,
                    height: 90,
                    child: DottedBorder(
                      child: Center(
                        child: Icon(
                          CupertinoIcons.cloud_upload_fill,
                          size: 40,
                          color: HexColor(ColorsUtils.color9999),
                        ),
                      ),
                    ),
                  ),
                  Expanded(
                    child: Padding(
                      padding: const EdgeInsets.only(left: 15),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Container(
                            alignment: Alignment.centerLeft,
                            child: Text(
                              '3、营业执照',
                              style: StylesUtils.customTextStyle(
                                fontSize: StylesUtils.fontSize15,
                                color: ColorsUtils.color0000,
                              ),
                            ),
                          ),
                          Container(
                            padding: const EdgeInsets.only(top: 10, right: 15),
                            alignment: Alignment.centerLeft,
                            child: Text(
                              '需要提供有效的营业执照，或监管部门认可的具有与营业执照同等法律效力的其他证件',
                              style: StylesUtils.customTextStyle(
                                color: ColorsUtils.color7979,
                                lineHeight: 1.2,
                              ),
                            ),
                          )
                        ],
                      ),
                    ),
                  ),
                ],
              ),
              Padding(
                padding: const EdgeInsets.symmetric(vertical: 30),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    SizedBox(
                      width: 135,
                      height: 90,
                      child: DottedBorder(
                        child: Center(
                          child: Icon(
                            CupertinoIcons.cloud_upload_fill,
                            size: 40,
                            color: HexColor(ColorsUtils.color9999),
                          ),
                        ),
                      ),
                    ),
                    Expanded(
                      child: Padding(
                        padding: const EdgeInsets.only(left: 15),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Container(
                              alignment: Alignment.centerLeft,
                              child: Text(
                                '4、许可证',
                                style: StylesUtils.customTextStyle(
                                  fontSize: StylesUtils.fontSize15,
                                  color: ColorsUtils.color0000,
                                ),
                              ),
                            ),
                            Container(
                              padding:
                                  const EdgeInsets.only(top: 15, right: 15),
                              alignment: Alignment.centerLeft,
                              child: Text(
                                '需要提供有效的许可证，或监管部门认可的具有与许可证同等法律效力的其他证件',
                                style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color7979,
                                  lineHeight: 1.5,
                                ),
                              ),
                            )
                          ],
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
        bottomNavigationBar: SafeArea(
          bottom: true,
          child: Container(
            padding: const EdgeInsets.symmetric(vertical: 10),
            height: 100,
            child: Column(
              children: [
                Container(
                  alignment: Alignment.centerLeft,
                  margin:
                      EdgeInsets.only(left: (Get.width - 315) / 2, bottom: 10),
                  child: Text.rich(
                    TextSpan(
                      children: [
                        WidgetSpan(
                            child: Obx(
                              () => controller.ischecked.value
                                  ? Icon(
                                      CupertinoIcons.checkmark_alt_circle_fill,
                                      size: 18,
                                      color: HexColor(ColorsUtils.colorFf64),
                                    )
                                  : Icon(
                                      CupertinoIcons.circle,
                                      size: 18,
                                      color: HexColor(ColorsUtils.color9999),
                                    ),
                            ),
                            alignment: PlaceholderAlignment.middle),
                        TextSpan(
                            text: ' 我已阅读并同意',
                            style: StylesUtils.customTextStyle(
                              fontSize: StylesUtils.fontSize12,
                              color: ColorsUtils.color9999,
                            )),
                        TextSpan(
                          text: '《小默外卖开店说明》',
                          style: StylesUtils.customTextStyle(
                            color: ColorsUtils.colorFf64,
                            fontSize: StylesUtils.fontSize12,
                          ),
                        ),
                      ],
                    ),
                  ).onTap(() {
                    controller.ischecked.value = !controller.ischecked.value;
                  }),
                ),
                Center(
                  child: Container(
                    alignment: Alignment.center,
                    constraints:
                        const BoxConstraints.expand(width: 315, height: 45),
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(23),
                      gradient: LinearGradient(
                        colors: [
                          ColorsUtils.rgba(255, 153, 0, 1),
                          ColorsUtils.rgba(255, 153, 0, 1),
                          ColorsUtils.rgba(254, 70, 1, 1),
                          ColorsUtils.rgba(254, 70, 1, 1)
                        ],
                        stops: const [0, 0, 1, 1],
                        transform: GradientRotation(
                          RadianUtils.angleToRadian(90),
                        ),
                        end: Alignment.topCenter,
                        begin: Alignment.bottomCenter,
                      ),
                    ),
                    child: Text(
                      '我准备好了',
                      style: StylesUtils.customTextStyle(
                        fontSize: StylesUtils.fontSize16,
                      ),
                    ),
                  ).onTap(() {
                    Get.toNamed(Routes.storeCategory);
                  }),
                )
              ],
            ),
          ),
        ),
      ),
    );
  }
}
